<template>
    <div>
        <div>
            <!-- 题目框 -->
            <label>{{wholeTitles.title.titNum}}::{{wholeTitles.title.content}}</label>
            
            <!-- 是否必做 -->
            <label>({{wholeTitles.title.must==1?'必做':'非必做'}})</label>

            <!-- 循环各个选项 -->
            <div v-for="(item,index) in wholeTitles.choices" :key="index" >  
                <!-- 每个选项 -->
                <el-radio   v-model="radio"    :label="index"  @change="change">  
                    {{index+1}}--{{wholeTitles.choices[index].content}}
                </el-radio>
            </div>

            <el-button @click="log()"   v-show="false">打印</el-button>
           <br/>

        </div>
    </div>

</template>

<script>
export default {

    props: {
        wholeTitles:{}
    },
    data(){
        return{
            count:4,                                      //题目数量  
            radio: null,                                   //双向绑定了用户选中的选项    
            mustdo:[{
                value: 1,                                   //1:必做
                label: '必做'                               //2：非比做
            },{
                value: 2,                               
                label:'非比做'
            }],  
            details:{
                num:11,
                detContent:''
            }  
        }
    },
    methods: {
        //监听选项的变化并且做出回应
        change(index){

            this.details.detContent=this.wholeTitles.choices[index].content;
            this.details.num=this.wholeTitles.title.titNum;
             console.log(this.details);
        },
        log(){
            console.log(this.radio);
            //console.log(this.wholeTitles.choices[this.radio].content);
            console.log(this.wholeTitles.title);
        }
    },
    
}
</script>
<style  scoped>
.inputboxClass{
    width: 300px;

}


</style>
